
<ul class="photo-viewer" #photoViewer>
  <li class="photo-viewer-none" *ngIf="(photos$ | async)?.length === 0">没有提供照片哟~</li>
  <li class="photo-viewer-item" *ngFor="let photo of (photos$ | async)">
    <p class="photo-viewer-img"><img [src]="photo.thumbnailSrc"></p>
    <p class="photo-viewer-des"><label>经度：</label>{{photo.longitude}}</p>
    <p class="photo-viewer-des"><label>纬度：</label>{{photo.latitude}}</p>
    <p class="photo-viewer-des"><label>方位角：</label>{{photo.azimuth}}</p>
    <p class="photo-viewer-btns">
      <a class="btn" [href]="photo.src" target="_blank" title="查看大图">查看大图</a>
    </p>
  </li>
</ul>

<div class="photo-viewer-footer">
  <button nz-button nzType="primary" nzSize="large" (click)="onClickClose()">关 闭</button>
</div>
